<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="../public/css/public.css" />
		<link rel="stylesheet" type="text/css" href="css/orderlist.css" />
	</head>

	<body>
		<div class="orderlist">
			<!--头部-->
			<div class="orderlist_head">订单</div>
			<!--没有登录-->
			<div class="nologin" v-bind:class="{'none':!ifdl,'block':ifdl}">
				<img src="img/noneorder.png" />
				<div>登陆后查看订单外卖</div>
				<div class="nologin_btn" @click="tzlogin()">立即登录</div>
			</div>
			<!--没有订单-->
			<div class="noneorder none" v-bind:class="{'none':!noneorder,'block':noneorder}">
				<img src="img/noneorder.png" />
				<div>近三个月无外卖记录</div>
			</div>
			<!--有订单-->
			<div class="hasorder none" v-bind:class="{'none':!hasorder,'block':hasorder}">
				<div class="load" v-bind:class="{'none':loading,'block':!loading}">
					<div class="csshub-loader">
						<div class="csshub-square"></div>
						<div class="csshub-square"></div>
						<div class="csshub-square"></div>
						<div class="csshub-square"></div>
						<div class="csshub-square"></div>
						<div class="csshub-square"></div>
						<div class="csshub-square"></div>
						<div class="csshub-square"></div>
						<div class="csshub-square"></div>
					</div>
				</div>
				<div class="none" v-bind:class="{'none':!loading,'block':loading}">
					<div class="hasorder_item" v-for="item in orderdata" @click="tzorder(item.id)">
						<div class="hasorder_item_top">
							<div class="shop_img">
								<img :src="img+item.attributes.shopimg" />
							</div>
							<div class="shop_name">
								<div v-html="item.attributes.shopname"></div>
								<div></div>
							</div>
							<div class="order_ifpay">
								<span v-if="item.attributes.if_pay" style="color:#6AC20B ;">订单已完成</span><span v-if="!item.attributes.if_pay" style="color: red;">订单已取消</span>
							</div>
						</div>
						<div class="hasorder_item_bottom">
							<div>{{item.attributes.products_data[0]['name']}}等{{item.attributes.total}}件商品</div>
							<div class="">￥{{item.attributes.actprice}}</div>
						</div>
					</div>
				</div>
			</div>
			<!--底部导航-->
			<div class="indexTabbar">
				<div class="indexTabbar_food">
					<div class=""></div>
					<span>美食</span>
				</div>
				<div class="indexTabbar_find">
					<div class=""></div>
					<span>发现</span>
				</div>
				<div class="indexTabbar_order acttabbar">
					<div class=""></div>
					<span>订单</span>
				</div>
				<div class="indexTabbar_ownr">
					<div class=""></div>
					<span>我的</span>
				</div>
			</div>
		</div>
		<script src="../public/js/Zepto_min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../public/js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="../public/js/public.js" type="text/javascript" charset="utf-8"></script>
		<script src="//cdn1.lncld.net/static/js/2.1.2/av-min.js"></script>
		<script src="js/orderlist.js" type="text/javascript" charset="utf-8"></script>
	</body>

</html>